var numList = [];
function tagName(name) {
	return  document.getElementsByTagName(name)[0].value;
}
function leftInputBtnHandler() {
	var dat = tagName("input");
	numList.unshift(dat);
	renderList();
}
function RightInputBtnHandler() {
	var dat = tagName("input");
	numList.push(dat);
	renderList();
}
function leftOutputBtnHandler() {
	// var dat = tagName("input");
	numList.shift();
	renderList();
}
function RightOutputHandler() {
	// var dat = tagName("input");
	numList.pop();
	renderList();
}
function renderList (){
	var number = " ";
	for(var i = 0;i < numList.length;i++){
		 number += "<label>"+numList[i]+"</label>";
	}
	document.getElementById("show-number").innerHTML = number;
	for (var i = 0; i < document.getElementsByTagName("label").length; i++) {
		document.getElementsByTagName("label")[i].className = "squard";
	}
}
function init() {
	var button = document.getElementsByTagName("button");
	for (var i = 0; i < button.length; i++) {
		var buttonID = button[i].id;
		if (buttonID == "left-input") {
			button[i].onclick = leftInputBtnHandler;
		}else if(buttonID == "right-input"){
			button[i].onclick = RightInputBtnHandler;
		}else if (buttonID == "left-output") {
			button[i].onclick = leftOutputBtnHandler;
		}else{
			button[i].onclick = RightOutputHandler;
		}
	}
}
init();